<!--
  2017年7月18日 星期二  
  用户未登录时
-->
<template>
  <div id="menu">
    <el-menu theme="dark" :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
    <el-menu-item index="1">
      <a href="/bin/surong">Aurora</a> 用户中心
    </el-menu-item>
    <!-- <el-menu-item index="2"><a href="/aurora/index/login">登陆</a></el-menu-item> -->
    <el-menu-item index="2"><a href="javascript:;">登陆</a></el-menu-item>
    
    <el-menu-item index="3"><a href="/aurora/index/register">注册</a></el-menu-item>
  </el-menu>

  <!-- 登录对话框 -->
  <el-dialog title="用户登录" :visible.sync="dialogFormVisible">
    <el-form :model="form" :rules="dialogFormRules" ref="dialogForm" label-width="100px">
      <el-form-item label="用户名称" prop="user_code">
        <el-input v-model="form.user_code" auto-complete="off"></el-input>
      </el-form-item>
      <el-form-item label="登录密码" prop="pswd">
        <el-input v-model="form.pswd" type="password" auto-complete="off"></el-input>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="dialogFormVisible = false">取 消</el-button>
      <el-button type="primary" @click="dialogFormCheck('dialogForm')">确 定</el-button>
    </div>
  </el-dialog>

  </div>
</template>

<script>
  export default {
    data() {
      return {
        activeIndex: '1',
        dialogFormVisible: false,
        form: {
          user_code: '',
          pswd: ''
        },
        dialogFormRules:{
          user_code: [
            { required: true, message: '登录账号不可为空', trigger: 'blur' }
          ],
          pswd: [
            { required: true, message: '登录密码不可为空', trigger: 'blur' }
          ]
        }
      };
    },
    methods: {
      handleSelect(key, keyPath) {
        //console.log(key, keyPath);
        if(2 == key){
          // 重置
          this.form.pswd = ''
          this.dialogFormVisible = true
        }
      },
      // 对话登录确认按钮
      dialogFormCheck(formName){
        this.$refs[formName].validate((valid) => {
          if (valid) {
            var formData = this.$refs[formName].model
            Axios.post('/login/user', formData).then((res)=>{
              var dd = res.data
              //console.log(dd)              
              if(1 == dd.error){
                this.$message({message: dd.msg, type: 'warning'})
              }else{
                this.dialogFormVisible = false
                this.form.pswd = ''
                location.reload(true)   // 登录成功以后刷新界面
              }
            }).catch((error)=>{
              console.log(error)
            })
          } else {
            return false;
          }
        });
      }
    }
  }
</script>